<template slot-scope="scope">
  <div>
    <el-checkbox :indeterminate="isIndeterminatePart" v-model="checkAllPart" @change="handlePartCheckAllChange">配件仓库</el-checkbox>
    <el-checkbox-group v-model="checkedPartList" @change="handleCheckedCitiesChangePart">
      <div style="margin:0px 0px 0px 20px;width:20px;">
        <el-checkbox v-for="part in sitesPart" :label="part.storageCode" :key="part.storageCode" :value="part.storageCode">
          {{part.storageName}}</el-checkbox>
      </div>
    </el-checkbox-group>
  </div>
</template>

<script>
  import { getPartAccessories } from '@/api/common/auth/roleManage'
  export default {
    name: "storagePart",
    data() {
      return {
        checkAllPart: false,
        loading: false,
        isIndeterminatePart: false,
        checkedPartList: [],
        sitesPart: []
      }
    },
    props: {},
    created() {
      this.loadData()
    },
    methods: {
      async loadData() {
        // this.loading = true;
        // const getPartAccessoriesRes = await getPartAccessories()
        // this.loading = false
        // if(getPartAccessoriesRes.resultCode === 200&&getPartAccessoriesRes.data&&getPartAccessoriesRes.data.length>0) {
        //   this.sitesPart = _.cloneDeep(getPartAccessoriesRes.data);
        // }
      },
      //全选
      handlePartCheckAllChange(val) {
        // debugger
        const checkedPartList = [];
        if (val) {
          for (var i = 0; i < this.sitesPart.length; i++) {
            checkedPartList.push(this.sitesPart[i].storageCode);
          }
        }
        this.checkedPartList = checkedPartList;
        // this.checkedPartList = val ? this.sitesPart : [];
        this.isIndeterminatePart = false;
      },
      handleCheckedCitiesChangePart(value) {
        let checkedCount = value.length;
        this.checkAllPart = checkedCount === this.sitesPart.length;
        this.isIndeterminatePart = checkedCount > 0 && checkedCount < this.sitesPart.length;
      },

      getData() {
        return [...this.checkedPartList]
      }
    }
  }

</script>

<style scoped>
  .el-checkbox+.el-checkbox {
    margin-left: 0px;
  }
  .el-checkbox {
    margin-right: 25px;
  }

</style>
